var Main = function () {
  this.init();
}

Main.prototype = {
  init: function () {
    var self = this || Main;
    self.cdTimer = null;
    self.tArr = getArr();
    self._endTime = 0;
    self._score = 0;
    $('.btn_s').unbind('click').on('click', function () {
      $('.one').fadeOut();
      $('.two').fadeIn(function () {
        self.show(0);
      });
    });
    return self;
  },
  show: function (num) {
    var self = this || Main;
    var ctn = t[self.tArr[num]];
    var n = 20 - num;
    $('.number span').eq(0).html(n);
    $('.type span').html(ctn[0]);
    $('.title').html(ctn[1]);
    if (ctn[2] !== ''){
      $('.opt').addClass('pic');
      $('#pic img').attr('src', ctn[2]);
    }
    $('#A').html(ctn[3]);
    $('#B').html(ctn[4]);
    $('#C').html(ctn[5]);
    $('#D').html(ctn[6]);
    self.clickOp(num);
    self.countdown(15, num);
    return self;
  },
  countdown: function (time, num) {
    var self = this || Main;
    $('.time').html(time);
    $('.yellow').animate({width: 0}, 20000);
    self.cdTimer = setInterval(function () {
      time --;
      $('.time').html(time);
      if (time <= 20 && time >= 11) {
        $('.yellow').css('background-color', 'rgb(143,195,31)');
      }
      if (time < 11 && time >= 5) {
        $('.yellow').css('background-color', 'rgb(255,241,0)');
      }
      if (time < 5 && time > 0) {
        $('.yellow').css('background-color', 'rgb(230,0,18)');
      }
      if (time <= 0) {
        self.anNo(num);
        clearInterval(self.cdTimer);
      }
    }, 1000);
    return self;
  },
  clickOp: function (num) {
    var self = this || Main;
    var ctn = t[self.tArr[num]];
    var an = ctn[7];
    console.log('正确答案：' + an);
    $('.op').unbind('click').one('click', function () {
      $('.mask').show();
      $('.yellow').stop();
      clearInterval(self.cdTimer);
      self._endTime = $('.time').html();
      var pick = $(this).attr('id');
      if (pick === an) {
        self.anYes(num);
      } else {
        self.anNo(num);
      }
    });
    return self;
  },
  anYes: function (num) {
    var self = this || Main;
    var point = self.getPoint(self._endTime);
    point = parseFloat(point);
    $('.addS').html(point);
    self._score += point;
    console.log(self._score);
    $('.yn').show();
    $('.yes').show();
    $('.addS').show();
    $('.addScore').show();
    setTimeout(function () {
      $('.addS').hide();
      $('.yes').hide();
      $('.addScore').hide();
      self.reset(num + 1);
    }, 1000);
    return self;
  },
  anNo: function (num) {
    var self = this || Main;
    var point = 0;
    $('.addS').html(point);
    $('.yn').show();
    $('.no').show();
    $('.addS').show();
    $('.addScore').show();
    setTimeout(function () {
      $('.addS').hide();
      $('.no').hide();
      $('.addScore').hide();
      self.reset(num + 1);
    }, 1000);
    return self;
  },
  getPoint: function (time) {
    var self = this || Main;
    var p = 4 + (1 * (time/15));
    p = p.toFixed(1);
    console.log(p);
    console.log(typeof(p));
    return p;
  },
  reset: function (num) {
    var self = this || Main;
    $('.yn').hide();
    $('.mask').hide();
    $('.opt').removeClass('pic');
    $('#pic').attr('src', '');
    $('.yellow').css({
      'width': '40vw',
      'background-color': 'rgb(143, 195, 31)'
    });
    if (num < 20) {
      self.show(num);
    } else {
      self.gameOver();
    }
    return self;
  },
  gameOver: function () {
    var self = this || Main;
    $('.two').hide();
    $('.three').fadeIn();
    self._score = self._score.toFixed(1);
    $('.score').html('您的得分：' + self._score);
    $('.btn_r').click(function () {
      location.reload();
    })
    return self;
  }
}

var main = new Main();
